<style>
    .container {
        display: flex;
        flex-flow: row-reverse wrap-reverse;
        /* 
            默认值： row nowrap
        */
    }

    p:first-child {
        background: red;
    }

    p:nth-child(2) {
        background: yellow;
    }
    p:nth-child(3) {
        background: rgb(0, 255, 76);
    }
    p:nth-child(4) {
        background: rgb(111, 0, 255);
    }
    p:nth-child(5) {
        background: rgb(82, 30, 14);
    }
    p:nth-child(6) {
        background: rgb(37, 145, 196);
    }
    p:nth-child(7) {
        background: rgb(179, 125, 27);
    }
    p:nth-child(8) {
        background: rgb(17, 17, 17);
    }
    p:nth-child(9) {
        background: rgb(166, 221, 184);
    }

    p:nth-last-child(1) {
        background: blue;
    }

    p {
        width: 200px;
        height: 200px;
    }
</style>

<div class='container'>
    <p>1</p>
    <p>2</p>
    <p>3</p>
    <p>4</p>
    <p>5</p>
    <p>6</p>
    <p>7</p>
    <p>8</p>
    <p>9</p>
</div>